<%--
  Created by IntelliJ IDEA.
  User: 92436
  Date: 2019/7/2
  Time: 11:38
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}" scope="page"/>
<html>
<head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    <link rel="stylesheet" href="${ctx}/css/templatemo_style.css" /> <!-- 页面整体布局样式定义 -->
    <link rel="stylesheet" href="${ctx}/css/ddsmoothmenu.css" /> <!-- 菜单样式定义 -->
    <script type="text/javascript" src="${ctx}/js/jquery-1.4.3.min.js"></script>

    <style type="text/css">
        form{ position:relative; left:50px; }
        .input_field { width: 620px; padding: 15px 0px; }
        .input_field p { position:relative; left:48px; margin: 0px 0px; }
        .input_field label { float: left; position:relative; top: 3px; }
        .input_field input { position:relative; }
        .input_field span { position:relative; left: 4px; color:#a8abab; }
        .input_field .codespan{ position:relative; top: -5px; left: 20px; }
        .input_field .vicode { position:relative; top:-6px; width:72px;  }
        .input_field img { position:relative; left:8px; width:72px; height:21px; }
        .input_field .imgchange { position:relative; top:-5px; left:15px; width:72px; height:21px; }
        .input_field .sub{ position:relative; left:46px; width:162px; }
        .input_field .toreg{ float: right; position:relative; top:4px; right:308px; }
    </style>
    <script type="text/javascript" src="js/jquery_1.12.4.min.js"></script>
    <script>

        $(document).ready(function(){
            $(".imgchange").click(function(){
                $("#imgcode").attr("src","http://localhost:8080/imgcode?createTypeFlag=nl&time"+new Date());
            });
        });
    </script>
</head>
<body>
<div id="templatemo_body_wrapper">
    <div id="templatemo_wrapper">

        <!-- header -->
        <div id="templatemo_header">
            <div id="site_title"><h1><a href="/home">穿美在线鞋城</a></h1></div>
            <div id="header_right">
                <p>
                    <a href="${ctx}/user?flag=lp" id="login">登录</a>&nbsp;
                    <span id="exitP" style="display: none"><a href="/user?flag=logout" id="exit">注销</a></span>
                </p>
            </div>
            <div class="cleaner"></div>
        </div>
        <!-- END of templatemo_header -->


        <!-- main -->
        <div id="templatemo_main">
            <div id="content" class="float_l" style="margin-left:220px;margin-top:20px;">
                <h3>登录</h3>
                <form action="${ctx}/user" method="post" id="loginform">
                    <input type="hidden" id="flag" name="flag" value="login" />

                    <div class="input_field">
                        <p style="color:red">${errMsg}</p>
                    </div>

                    <div class="input_field">
                        <label for="username">用户名：</label>
                        <input type="text" id="username" name="username" value="" />
                        <span id="un_msg">2~8个字符，可使用字母、数字、下划线，需以字母开头</span>
                    </div>

                    <div class="input_field">
                        <label for="password">密&nbsp;&nbsp;&nbsp;码：</label>
                        <input type="password" id="password" name="password" value="" />
                        <span id="pw_msg">6~16个字符，区分大小写</span>
                    </div>

                    <div class="input_field">
                        <label for="vicode">验证码：</label>
                        <input type="text" id="vicode" name="vicode" value="" maxlength="4" class="vicode" />
                        <img id="imgcode" alt="" src="${ctx}/imgcode?createTypeFlag=nl"><a href="javascript:void(0);" class="imgchange">看不清，换一张</a>
                        <span id="vicd_msg" class="codespan">请输入4位验证码，不区分大小写</span>
                    </div>

                    <div class="input_field">
                        <input type="submit" class="sub" value="登录">
                        <a href="${ctx}/user?flag=rp" class="toreg">没有账号？去注册</a>
                    </div>
                </form>
            </div>
            <div class="cleaner"></div>
        </div>
        <!-- END of templatemo_main -->

        <!-- footer -->
        <div id="templatemo_footer">
            <p>
                <a href="${ctx}/home">首页</a> | <a href="${ctx}/product">产品</a> | <a href="${ctx}/shopcart">我的购物车</a> | <a href="/order">我的订单</a>
            </p>
            版权所有 (c) 2018 <a href="javascript:void(0);">金桥软件</a>
        </div>
        <!-- END of templatemo_footer -->
    </div>
</div>
</body>
</html>